<template>
    <div class="absolute" :style="position" @dblclick="handleDblclick">
        <img :src="cargoImg">
    </div>
</template>

<script setup lang='ts'>
import { useEditCargoStore,type EditCargo } from '@/store/edit/editCargo';
import  cargoImg from '../../assets/cargo.png'
import { STEP_EDIT, usePosition } from '../../composables/usePosition';

interface Props {
    cargo:EditCargo;
}

const props = defineProps<Props>()

const { position }  = usePosition(props.cargo,STEP_EDIT)
const { removeCargo } = useEditCargoStore()

const handleDblclick = () => {
    removeCargo(props.cargo)
}

</script>